import {View, Input, Image} from "@tarojs/components";
import "./homeSelected.less"
import React, {useState,useEffect} from 'react'
import Taro from "@tarojs/taro"
import store from "../../../store";
import http from "../../../service/api";
import {toJS} from "mobx";

function Selected() {
   useEffect(()=>{
       console.log(toJS(store.selectedData))
   },[])
    //热销data
    const [hotData, setHotData] = useState(toJS(store.selectedData))
    const [tjData,setTjData]=useState(store.selectNoneData)
    //跳转商品详情
    const goodData = (item) => {
        store.setDataId(item.id)
        store.setSid(item.bid)
        Taro.navigateTo({
            url: "../../details/details"
        })
    }
    return (
        <View className="selected">
            {hotData.length!=0?
                <View className="hot">
                    <View className="hotGoods">
                        {hotData.map((item) => {
                            return (
                                <View className="hotGood" onClick={() => {
                                    goodData(item)
                                }}>
                                    <Image src={item.img} className="img" lazyLoad={true}/>
                                    <View>{item.name}</View>
                                    <View>￥{item.price}</View>
                                </View>
                            )
                        })}
                    </View>
                </View>:
                <View>
                    <View className="none">
                        暂时没有结果哦！
                    </View>
                    <View className="selectLook">看看以下商品吧~</View>
                    <View className="hot">
                        <View className="hotGoods">
                            {tjData.map((item) => {
                                return (
                                    <View className="hotGood" onClick={() => {
                                        goodData(item)
                                    }}>
                                        <Image src={item.img} className="img" lazyLoad={true}/>
                                        <View>{item.name}</View>
                                        <View>￥{item.price}</View>
                                    </View>
                                )
                            })}
                        </View>
                    </View>
                </View>
           
            }
       
        </View>
    )
}

export default Selected